// 封装Gtegory分类 相关的逻辑代码
import {onMounted, ref} from 'vue'
import {getGategoryAPI} from '@/apis/category'
import { useRoute } from 'vue-router'
import { onBeforeRouteUpdate } from 'vue-router'

export function useGategory(){
  const gategoryList = ref({})
  const route = useRoute()
  const getGategory = async (id = route.params.id) => {
    const res = await getGategoryAPI(id)
    console.log(res,'面包屑接口');
    gategoryList.value = res.result
  }

  onMounted(() => {
    getGategory()
  })
  // 方法二 ：目标 路由参数发生变化 可以把分类数据接口重新发送  to是固定的 指目标路由对象
  onBeforeRouteUpdate((to) => {
    console.log('路由变化了')
    console.log(to);
    // 调用分类接口
    // 存在问题 使用最新的路由参数请求最新的分类数据 这里就是传了参数 在初始化的时候和路由更新时候 都可以适配到
    getGategory(to.params.id)
  })
  return{
    gategoryList
  }
}